<template>
  <div>
          <div style="height:200px;overflow:auto">
            <el-tree
            :data="promptText"
            :props="defaultProps"
            accordion
            @node-click="handleNodeClick"
            :render-content="renderContent">
          </el-tree>
          </div>
          <el-input
            style="margin-top:20px"
            type="textarea"
            :rows="10"
            placeholder="方法说明书"
            :value="textarea">
          </el-input>
    
  </div>
</template>

<script>
export default {
  data() {
    return {
      textarea:'',
      promptText:[{
          label: '自定义界面方法（sys）',
          instructions:``,
          children: [{
            label: '按钮脚本',
            children: [{
            label: '1.	新增',
            scp:`let url="/dept/selectFillDept";
            let data = {funcId:null,funcCode:"",type:2};
            sys.Add(url,data);`,
            instructions:`
            请求参数（JSON）	funcId菜单ID  funcCode菜单code  type该字段不可改变
            let url="/dept/selectFillDept";
            let data = {funcId:null,funcCode:"",type:2};
            sys.Add(url,data);
            `
          },{
            label: '2.	编辑',
            scp:`let url="/role/editAut2";
            let data ={funcId:null,funcCode:null,tableName:"",id:"",keyName:""};
            sys.Edit(url,data);`,
            instructions:`sys.Edit(url,data)
            请求参数（JSON）funcId菜单ID  funcCode菜单code  tableName编辑表名称  id编辑数据ID  keyName编辑数据主键
            let url="/role/editAut2";
            let data ={funcId:null,funcCode:null,tableName:"",id:"",keyName:""};
            sys.Edit(url,data);
            `
          },{
            label: '3.	删除',
            scp:`let url="/page/remove";
            let data ={pageId:null,values:[""],menuId:null,menuCode:null};
            sys.Delete(url,data);`,
            instructions:`sys.Delete(url,data)
            请求参数（JSON）  pageId页面ID  values删除数据数组  menuId菜单ID  menuCode编辑
            let url="/page/remove";
            let data ={pageId:null,values:[""],menuId:null,menuCode:null};
            sys.Delete(url,data);
            `
          },{
            label: '4.	导出',
            scp:`let url="/page/export";
            let data ={pageId:null, menuId:null,menuCode:null, params :[‘’]};
            sys.Export(url,data);`,
            instructions:`sys.Export(url,data)
            请求参数（JSON）  pageId页面ID  menuId菜单ID  menuCode菜单Code  params数据数组
            let url="/page/export";
            let data ={pageId:null, menuId:null,menuCode:null, params :[‘’]};
            sys.Export(url,data);
            `
          },{
            label: '5.	查看流程',
            scp:`let id="";
            sys.ViewFlow(id);`,
            instructions:`sys.ViewFlow(id)
            请求参数（JSON） id选择数据ID
            let id="";
            sys.ViewFlow(id);
            `
          },{
            label: '6.	导入',
            scp:`let url="/dept/selectFillDept";
            let data = {funcId:null,funcCode:"",type:2};
            sys.Import(url,data);`,
            instructions:`sys.Import(url,data)
            请求参数（JSON）  funcId菜单ID  funcCode菜单Code  type类型
            let url="/dept/selectFillDept";
            let data = {funcId:null,funcCode:"",type:2};
            sys.Import(url,data);
            `
          },{
            label: '7.	调用自定义表单界面弹窗',
            scp:`let param={"doubleEvent":null,"dblParamIn":"{\"classId\":\"1905\",\"workId\":\"[]\",\"tableName\":\"GONGDAN_INFO1\",\"keyName\":\"GD_ID\",\"tdeptId\":\"[deptId]\",\"nodeId\":\"1\",\"businessInfo\":\"null\"}","dblParamOut":null,"dblvue":"cellView.vue","dblcomId":1905,"dblcomText":"mysql巡视表","onlyOne":false,"type":2,"sql":null}
            sys.openCompoent(param);`,
            instructions:`sys.openCompoent(param)
            请求参数（JSON） param菜单ID
            let param={"doubleEvent":null,"dblParamIn":"{\"classId\":\"1905\",\"workId\":\"[]\",\"tableName\":\"GONGDAN_INFO1\",\"keyName\":\"GD_ID\",\"tdeptId\":\"[deptId]\",\"nodeId\":\"1\",\"businessInfo\":\"null\"}","dblParamOut":null,"dblvue":"cellView.vue","dblcomId":1905,"dblcomText":"mysql巡视表","onlyOne":false,"type":2,"sql":null}
            sys.openCompoent(param);
            `
          }]
          },{
            label: '其他',
            instructions:``,
            children:[{
              label: '1.	根据列名修改列的宽度',
              scp:`let columnName=‘MONTH_JOB_CODE’;
              let columnWidth=100;
              sys.setTabColumnWide (columnName, columnWidth);`,
              instructions:`sys.setTabColumnWide (columnName, columnWidth)
              请求参数（JSON） columnName列名  columnWidth宽度值
              let columnName=‘MONTH_JOB_CODE’;
              let columnWidth=100;
              sys.setTabColumnWide (columnName, columnWidth);
              `
            },{
              label: '2.	通过键值获取该元素',
              scp:`let columnName=‘MONTH_JOB_CODE’;
              let columnObj = sys.getColFielNameByKey (columnName);`,
              instructions:` sys.getColFielNameByKey (columnName)
              请求参数（JSON） columnName列名
              let columnName=‘MONTH_JOB_CODE’;
              let columnObj = sys.getColFielNameByKey (columnName);
              `
            },{
              label: '3.	获取单个按钮的对象',
              scp:`let buttonName =‘MONTH_JOB_CODE’;
              let buttonObj = sys. getButtonByKey (buttonName);`,
              instructions:`sys. getButtonByKey (buttonName)
              请求参数（JSON）  buttonName列名
              let buttonName =‘MONTH_JOB_CODE’;
              let buttonObj = sys. getButtonByKey (buttonName);
              `
            },{
              label: '4.	自定义按钮权限',
              scp:`let buttonName =‘button_Edite’;
              let autNames=‘编辑’
              let bol= sys. setAut (buttonName, autNames);`,
              instructions:`sys. setAut (buttonName, autNames)
              请求参数（JSON）  code按钮键值  autNames权限名称（中文名）
              let buttonName =‘button_Edite’;
              let autNames=‘编辑’
              let bol= sys. setAut (buttonName, autNames);
              `
            },{
              label: '5.	设置当前选择的单元格文本',
              scp:`let textValue =‘测试;
              sys. setCurrentText (textValue);`,
              instructions:`sys. setCurrentText (textValue)
              请求参数（JSON） textValue文本值
              let textValue =‘测试;
              sys. setCurrentText (textValue);
              `
            },{
              label: '6.	获取单元格值',
              scp:`let row =1;
              let col=1;
              let colName= sys. getCellValue (row, col);`,
              instructions:`sys. getCellValue (row, col)
              请求参数（JSON） row行  col列
              let row =1;
              let col=1;
              let colName= sys. getCellValue (row, col);
              `
            },{
              label: '7.	获取单元格文本',
              scp:`let row =1;
              let col=1;
              let cellText= sys. getCellText (row, col);`,
              instructions:`sys. getCellText (row, col)
              请求参数（JSON） row行  col列
              let row =1;
              let col=1;
              let cellText= sys. getCellText (row, col);
              `
            },{
              label: '8.	设置单元格值（属性名）',
              scp:`let row =1;
              let col=1;
              let value=”name
              sys. setCellValue (row, col,value);`,
              instructions:`sys. setCellValue (row, col,value)
              请求参数（JSON）  row行  col列  value值
              let row =1;
              let col=1;
              let value=”name
              sys. setCellValue (row, col,value);
              `
            },{
              label: '9.	设置单元格文本',
              scp:`let row =1;
              let col=1;
              let value=”测试“
              sys. setCellText (row, col,value);`,
              instructions:`sys. setCellText (row, col,value)
              请求参数（JSON） row行  col列  value值
              let row =1;
              let col=1;
              let value=”测试“
              sys. setCellText (row, col,value);
              `
            },{
              label: '10.	获取字段值',
              scp:`let recordIndex =1;
              let fieldName =“name”; “
              let field= sys. setCellText (recordIndex, fieldName);`,
              instructions:`sys. setCellText (recordIndex, fieldName);
              请求参数（JSON） recordIndex第几条记录  fieldName字段文本值（属性值）
              let recordIndex =1;
              let fieldName =“name”; “
              let field= sys. setCellText (recordIndex, fieldName);
              `
            },{
              label: '11.	获取字段文本',
              scp:`let recordIndex =1;
              let fieldName =“name”; “
              let field= sys. setCellText (recordIndex, fieldName);`,
              instructions:`sys. setCellText (recordIndex, fieldName)
              请求参数（JSON） recordIndex第几条记录  fieldName字段文本值（属性名）
              let recordIndex =1;
              let fieldName =“name”; “
              let field= sys. setCellText (recordIndex, fieldName);
              `
            },{
              label: '12.	设置字段值',
              scp:`let recordIndex =1;
              let fieldName =“name”; 
              let value=”id”
              sys. setCellText (recordIndex, fieldname, value);`,
              instructions:`sys. setCellText (recordIndex, fieldname, value)
              请求参数（JSON） recordIndex第几条记录  fieldName字段文本值（属性名） value值
              let recordIndex =1;
              let fieldName =“name”; 
              let value=”id”
              sys. setCellText (recordIndex, fieldname, value);
              `
            },{
              label: '13. 字段方式快速访问值',
              scp:`let recordIndex =1;
              let fieldName =“name”; 
              let text= sys. setCellText (recordIndex, fieldname);`,
              instructions:`sys. setCellText (recordIndex, fieldname)
              请求参数（JSON） rowIndex第几条记录  filedName字段文本值（属性名）
              let recordIndex =1;
              let fieldName =“name”; 
              let text= sys. setCellText (recordIndex, fieldname);
              `
            },{
              label: '14. 坐标方式快速访问值',
              scp:`let rowIndex =1;
              let colIndex =2 ;
              let text= sys. setCellText (rowIndex, colIndex);`,
              instructions:`sys. setCellText (rowIndex, colIndex)
              请求参数（JSON） rowIndex第几条记录  colIndex第几列
              let rowIndex =1;
              let colIndex =2 ;
              let text= sys. setCellText (rowIndex, colIndex);
              `
            },{
              label: '15. 获取列表对象',
              scp:`let table= sys. getWorkTable ()`,
              instructions:`
              let table= sys. getWorkTable ()`
            },{
              label: '16. 获取表格对象',
              scp:`let table= sys. getWorkField ()`,
              instructions:`
              let table= sys. getWorkField ()`
            },{
              label: '17. $ajax-JSON格式请求',
              scp:`
                sys.$ajax({
                  url:url,
                  data:data,
                  type:"POST",
                  dataType:"json",
                  success:function(result){
                    //请求成功
                  },
                  error:function(error){
                    //执行失败
                  }
                })
              `,
              instructions:`
              AJAX请求
                sys.$ajax({
                    url:url,
                    data:data,
                    type:"POST",
                    dataType:"json",
                    success:function(result){
                      //请求成功
                    },
                    error:function(error){
                      //执行失败
                    }
                  })
              `
            },{
              label: '18. $ajax-非JSON格式请求',
              scp:`
                sys.$ajax({
                  url:url,
                  data:data,
                  type:"GET",
                  success:function(result){
                    //请求成功
                  },
                  error:function(error){
                    //执行失败
                  }
                })
              `,
              instructions:`
              AJAX请求
                sys.$ajax({
                    url:url,
                    data:data,
                    type:"GET",
                    success:function(result){
                      //请求成功
                    },
                    error:function(error){
                      //执行失败
                    }
                  })
              `
            },{
              label: '19. 打开自定义表单函数',
              scp:`
                let data="";
                sys.openComponent(data);
              `,
              instructions:`
              打开自定义表单函数
                let data="";
                sys.openComponent(data);
              `
            },{
              label: '20. 获取当前选择数据索引值',
              scp:`
                sys.getCheckedRow();
              `,
              instructions:`
              获取当前选择数据索引值
                sys.getCheckedRow();
              `
            },{
              label: '21. 获取当前选择数据索引值(多个)',
              scp:`
                sys.getCheckedRows();
              `,
              instructions:`
              获取当前选择数据索引值
                sys.getCheckedRows();
              `
            },{
              label: '22. 获取选中的数据',
              scp:`
                sys.getCheckedRowsData();
              `,
              instructions:`
              获取选中的数据
                sys.getCheckedRowsData();
              `
            },{
              label: '23. 根据中文名返回字段值',
              scp:`
                sys.getCheckedDataByName(name);
              `,
              instructions:`
              根据中文名返回字段值
                sys.getCheckedDataByName(name);
              `
            },{
              label: '24. 根据索引值和键名返回字段值',
              scp:`
                sys.getCheckedDataByRowAndName(rowIndex,name);
              `,
              instructions:`
              根据索引值和键名返回字段值
                sys.getCheckedDataByRowAndName(rowIndex,name);
              `
            },{
              label: '25. 获取当前用户ID',
              scp:`
                sys.getCurrentUserId();
              `,
              instructions:`
              获取当前用户ID
                sys.getCurrentUserId();
              `
            },{
              label: '26. 根据键名获取选择数据对应的值',
              scp:`
                sys.getCurrentUserId();
              `,
              instructions:`
              根据键名获取选择数据对应的值，只能选择一条数据
                sys.getCurrentUserId();
              `
            },{
              label: '27. 调用外部项目页面并传值',
              scp:`
                sys.setExternalPageData(url,data);
              `,
              instructions:`
                根据url的值打开指定的页面，data为JSON格式的字符串,
                把data存在Cookie中,Cookie的变量名为externalPageData
                sys.setExternalPageData(url,data);
              `
            },{
              label: '28. 获取外部页面返回值',
              scp:`
                sys.getExternalPageData(cookieName);
              `,
              instructions:`
                根据cookieName获取指定的cookie值
                sys.getExternalPageData(cookieName);
              `
            }]
          }]
        }, {
          label: '自定义表单方法（sys.rep）',
          instructions:`表单定义方法
          1.文本信息为string类型，值信息为object类型其中包含id和name；
          2.Fieldname参数必须大写；
          3.单元格从0,0开始计算
          4.所有命令必须以分号“;”进行分隔
          sys.rep`,
          children: [{
            label: '表信息查询',
            instructions:`获取数据表相关信息,通过数据表、记录、字段名来获取或设置相关信息`,
            children: [{
            label: '1. 查询表table数量',
            scp:`sys.rep.getTableCount()`,
            instructions:`getTableCount()
            let number=sys.rep.getTableCount()；console.log(number)// 3`
          },{
            label: '2. 查询表信息',
            scp:`sys.rep.getWorkRep()`,
            instructions:`getWorkRep()
            let obj=sys.rep.getWorkRep ()；console.log(obj) // {…}`
          },{
            label: '3. 查询table',
            scp:`sys.rep.getWorkTable(tableindex)`,
            instructions:`getWorkTable(tableindex)
            携带参数	tableindex	选择第几个table  （number）
            let obj= getWorkTable(tableindex)；
            console.log(obj) // {…}
            `
          },{
            label: '4. 查询table中记录数量',
            scp:`sys.rep.getRecordCount(tableindex)`,
            instructions:`getRecordCount(tableindex)
            携带参数	tableindex	选择第几个table  （number）
            let number=sys.rep.getRecordCount(tableindex)；
            console.log(number) // 1
            `
          },{
            label: '5. 查询table中第记录信息',
            scp:`sys.rep.getRecordContent(tableindex,recordindex)`,
            instructions:`getRecordContent(tableindex,recordindex)
            携带参数	tableindex, recordindex	选择第几个table，第几条记录  （number）
            let obj= sys.rep.getRecordContent(tableindex,recordindex)；
            console.log(obj) // {…}
            `
          },{
            label: '6. 查询table中记录字段名的文本信息',
            scp:`sys.rep.getFieldText(tableindex,recordindex,fieldname)`,
            instructions:`getFieldText(tableindex,recordindex,fieldname)
            携带参数	tableindex,recordindex,fieldname	选择第几个table，第几条记录，相应的字段名称
            let text= sys.rep.getFieldText(tableindex,recordindex,fieldname)；
            console.log(text) // “…”
            `
          },{
            label: '7.	设置table中记录字段名的文本信息',
            scp:`sys.rep.setFieldText(tableindex,recordindex,fieldname,text)`,
            instructions:`setFieldText(tableindex,recordindex,fieldname,text)
            携带参数	tableindex,recordindex,fieldname,text	选择第几个table，第几条记录，相应的字段名称，需要设置的内容
            sys.rep. setFieldText(tableindex,recordindex,fieldname,text)`
          },{
            label: '8. 查询table中字段的值',
            scp:`sys.rep.getFieldValue(tableindex,fieldname)`,
            instructions:`getFieldValue(tableindex,fieldname)
            携带参数	tableindex,fieldname	选择第几个table，相应的字段名称let obj= sys.rep.getFieldValue(tableindex,fieldname)；
            console.log(obj)  
            // {ID:123,NAME:”张三”}
            `
          },{
            label: '9.	设置table中字段的值',
            scp:`sys.rep.setFieldValue(tableindex,recordindex,fieldname,id,name)`,
            instructions:`setFieldValue(tableindex,recordindex,fieldname,id,name)
            携带参数	tableindex,recordindex,fieldname,id,name	选择第几个table，第几条记录，相应的字段名称，需要设置的id和name
            Sys.rep.setFieldValue(tableindex,recordindex,fieldname,id,name)`
          },{
            label: '10.	获取table中包含该字段名单元格信息',
            scp:`sys.rep.getWorkField(tableIndex,fieldName)`,
            instructions:`getWorkField(tableIndex,fieldName)
            携带参数	tableIndex,fieldName	对应table和字段名
            let obj= sys.rep.getWorkField(tableIndex,fieldName)；
            console.log(obj) 
            // {… }
            `
          }]
          },{
            label: '单元格信息查询',
            instructions:`通过单元格的坐标信息来获取或设置相关信息`,
            children:[{
            label: '1.	查询单元格文本内容',
            scp:`sys.rep.getCellText(row,col)`,
            instructions:`getCellText(row,col)
            携带参数	row,col	相应的行和列
            let text= sys.rep.getCellText(row,col)；
            console.log(text) // “…”
            `
          },{
            label: '2.	查询单元格值内容',
            scp:`sys.rep.getCellValue(row,col)`,
            instructions:`getCellValue(row,col)
            携带参数	row,col	相应的行和列
            let obj= sys.rep.getCellValue(row,col)；
            console.log(obj) 
            // {ID:123,NAME:”张三”}
            `
          },{
            label: '3.	设置单元格文本内容',
            scp:`sys.rep.setCellText(row,col,text)`,
            instructions:`setCellText(row,col,text)
            携带参数	row,col,text	相应的行和列，设置的内容
            sys.rep.setCellText(row,col,text)；`
          },{
            label: '4.	设置单元格值内容',
            scp:`sys.rep.setCellValue(row,col,id,name)`,
            instructions:`setCellValue(row,col,id,name)
            携带参数	row,col,id,name	相应的行和列，设置的值内容的id和name
            sys.rep.setCellValue(row,col,id,name)；`
          },{
            label: '5.	获取当前单元格属性信息',
            scp:`sys.rep.getCellAttribute(row,col)`,
            instructions:`getCellAttribute(row,col)
            携带参数	row,col	相应的行和列
            let obj= sys.rep.getCellAttribute(row,col)；
            console.log(obj) 
            // {… }
            `
          },{
            label: '6.	设置当前单元格属性信息',
            scp:`sys.rep.setCellAttribute(row,col,key,value)`,
            instructions:`setCellAttribute(row,col,key,value)
            携带参数	row,col,key,value	相应的行和列，设置的键和值
            sys.rep.setCellAttribute(row,col,key,value)；`
          },{
            label: '7.	获取当前单元格事件信息',
            scp:`sys.rep.getCellEvent(row,col)`,
            instructions:`getCellEvent(row,col)
            携带参数	row,col	相应的行和列
            let obj= sys.rep.getCellEvent(row,col)；
            console.log(obj) 
            // {… }
            `
          },{
            label: '8.	设置当前单元格事件信息',
            scp:`sys.rep.setCellEvent(row,col,key,value)`,
            instructions:`setCellEvent(row,col,key,value)
            携带参数	row,col,key,value	相应的行和列，设置的键和值
            sys.rep.setCellEvent(row,col,key,value)；`
          },{
            label: '9.	获取当前单元格样式信息',
            scp:`sys.rep.getCellStyle(row,col)`,
            instructions:`getCellStyle(row,col)
            携带参数	row,col	相应的行和列
            let obj= sys.rep.getCellStyle(row,col)；
            console.log(obj) 
            // {… }
            `
          },{
            label: '10.	设置当前单元格样式信息',
            scp:`sys.rep.setCellStyle (row,col,key,value)`,
            instructions:`setCellStyle (row,col,key,value)
            携带参数	row,col,key,value	相应的行和列，设置的键和值
            sys.rep.setCellStyle (row,col,key,value)；`
          }]
          },{
          label: 'ajax请求',
          instructions:'发送请求',
          children: [{
            label: '1. 发送后端请求(ajax)',
            scp:`sys.rep.ajax({
                  url:url,
                  data:data,
                  type:"POST",
                  dataType:"json",
                  sync:true,
                  success:function(result){
                    //请求成功
                  },
                  error:function(error){
                    //执行失败
                  }
                })`,
            instructions:`ajax()
            sys.rep.ajax({
                  url:url,
                  data:data,
                  type:"POST",
                  dataType:"json",
                  sync:true,
                  success:function(result){
                    //请求成功
                  },
                  error:function(error){
                    //执行失败
                  }
                })`
          },{
            label: '2.	发送后端请求(axios)',
            scp:`sys.rep.requestApi(url, method, param, type)`,
            instructions:`requestApi(url, method, param, type)
            携带参数	url, method, param, type	请求地址，请求类型(get,post…)，请求携带参数；type为请求参数类型，如果是键值对格式type设置1如果是JSON格式type设置2
            let data =  sys.rep.requestApi(url, method, param, type)
            data.then(data => {
              console.log(data)
            })`
          }]
        },{
          label: '表单常用按钮',
          instructions:'表单中自带按钮，可通过自定义按钮的方式实现功能',
          children: [{
            label: '1.	表单保存',
            scp:`sys.rep.workSever()`,
            instructions:`workSever()
            sys.rep.workSever()`
          },{
            label: '2.	表单发送',
            scp:`sys.rep.workSend()`,
            instructions:`workSend()
            sys.rep.workSend()`
          },{
            label: '3.	表单回退',
            scp:`sys.rep.workFallback()`,
            instructions:`workFallback()
            sys.rep.workFallback()`
          },{
            label: '4.	表单作废',
            scp:`sys.rep.workInvalid()`,
            instructions:`workInvalid()
            sys.rep.workInvalid()`
          },{
            label: '5.	表单加行',
            scp:`sys.rep.workAddRow()`,
            instructions:`workAddRow()
            sys.rep.workAddRow()`
          },{
            label: '6.	表单删行',
            scp:`sys.rep.workDelRow()`,
            instructions:`workDelRow()
            sys.rep.workDelRow()`
          },{
            label: '7.	表单打印',
            scp:`sys.rep.workPrint()`,
            instructions:`workPrint()
            sys.rep.workPrint()`
          }]
        },{
          label: '表单定义事件内容',
          instructions:'表单管理中定义事件内容的方法',
          children: [{
            label: '1. 事件内容',
            scp:`sys.rep.open(data)`,
            instructions:`sys.rep.open(data)
            携带参数data data为输入框内提示内容，或修改后符合提示框内内容的对象格式信息`
          }]
        }]
        }],
      defaultProps: {
        children: 'children',
        label: 'label'
      },
    }
  },
  methods: {
    handleNodeClick(e){
      this.textarea = e.instructions
    },
     renderContent(h, { node, data, store }) {
        return (
          <span class="custom-tree-node">
            <span>{node.label}</span>
            <span>
              <el-button size="mini" type="text" on-click={ () => {
                if(data.scp){
                  return this.$emit('write',data.scp)
                }
              } }>Append</el-button>
            </span>
          </span>);
      }
  },
}
</script>

<style>

</style>